let mask = document.querySelector(".mask");
let fileDom = document.querySelector(".file");
let tis = document.querySelector(".tis");
let progress = document.querySelector(".tis-progress");
let cancel = document.querySelector(".cancel-btn");


let createUpload = (file, url, key = 'file', header = {}, data = {}) => {
  console.log(`
	上传地址:${url}\n
	请求头:${JSON.stringify(header)}\n
	参数:${JSON.stringify(data)}
	`);
  if (!url) {
    return;
  }
  tis.style.display = 'flex';

  let formData = new FormData();
  formData.append(key, file);

  for (let keys in data) {
    formData.append(keys, data[keys]);
  }

  let xhr = new XMLHttpRequest();
  xhr.open("POST", url, true);

  for (let keys in header) {
    xhr.setRequestHeader(keys, header[keys]);
  }
  xhr.upload.addEventListener("progress", function (event) {
    if (event.lengthComputable) {
      let percent = Math.ceil(event.loaded * 100 / event.total) + "%";
      progress.innerText = `努力上传中..${percent}`;
    }
  }, false);

  xhr.ontimeout = function () {
    // xhr请求超时事件处理
    progress.innerText = '请求超时';
    setTimeout(() => {
      tis.style.display = 'none';
      plus.webview.currentWebview().close();
    }, 1000);
  };

  xhr.onreadystatechange = (ev) => {

    if (xhr.readyState == 4) {
      console.log('status：' + xhr.status);
      if (xhr.status == 200) {
        progress.innerText = '上传成功';
        location.href = `callback?fileName=${escape(file.name)}&id=${escape(xhr.responseText)}`;
      } else {
        progress.innerText = '上传失败了';
      }
      setTimeout(() => {
        tis.style.display = 'none';
        plus.webview.currentWebview().close();
      }, 1000);

    }
  };
  xhr.send(formData);

  cancel.addEventListener("click", () => {
    xhr.abort();
    plus.webview.currentWebview().close();
  });
};


mask.addEventListener("click", () => {
  plus.webview.currentWebview().close();
});

document.addEventListener('UniAppJSBridgeReady', () => {
  let {
    url,
    key,
    header,
    formData
  } = plus.webview.currentWebview();
  fileDom.addEventListener('change', (event) => {
    let file = fileDom.files[0];
    if (file.size > 1024 * 1024 * 10) {
      plus.nativeUI.toast('单个文件请勿超过10M,请重新上传');
      return;
    }
    createUpload(file, url, key, header, formData);
  }, false);
});